<template>
  <!---------- 搜索表单区域 ----------->
  <SearchFormTemplate ref="searchRef" :searchConfig="searchConfig" @search="getTableData" @reset="handleReset" />

  <!---------- 顶部按钮区域 ----------->
  <ToolbarTemplate :toolbarConfig="toolbarConfig" />

  <!---------- 表格区域 ----------->
  <TableTemplate :columns="columns" ref="tableRef" />
  
  <!-- 添加表单 -->
  <MchexpandAdd ref="addRef" @dataReload="getTableData" />
  <MchexpandAddWeChat ref="addWechatRef" @dataReload="getTableData" />
  <MchexpandAddAliplay ref="addAliplayRef" @dataReload="getTableData" />
  
  <!-- 修改表单  -->
  <MchexpandEdit ref="editRef" @dataReload="getTableData" />

  <!--预审表单-->
  <MchexpandSetInquiry ref="inquiryRef" @dataReload="getTableData" />

  <!--预审表单-->
  <MchexpandShowSingGrcode ref="showSingGrcodeRef" @dataReload="getTableData" />
</template>
<script setup lang="ts">
  import { onMounted, ref } from 'vue';
  import SearchFormTemplate from '@/components/template/form/search-form-template.vue';// 搜索区模版
  import ToolbarTemplate from '@/components/template/button/toolbar-template.vue';// 操作区模版
  import TableTemplate from '@/components/template/table/table-template.vue';//分页表格模版
  import MchexpandAdd from '@/views/mchexpand/mchexpand_add.vue';//模块添加页
  import MchexpandAddWeChat from '@/views/mchexpand/mchexpand_add_wechat.vue';//模块添加页
  import MchexpandAddAliplay from '@/views/mchexpand/mchexpand_add aliplay.vue';//模块添加页
  import MchexpandEdit from '@/views/mchexpand/mchexpand_edit.vue';//模块添加页
  import MchexpandSetInquiry from '@/views/mchexpand/mchexpand_set_inquiry.vue';//模块添加页
  import MchexpandShowSingGrcode from '@/views/mchexpand/mchexpand_show_sing_qrcode.vue';//模块添加页
  import { type CustomTableColumnType } from '@/types/table';//扩展 TableColumnType 定义

  /* [显示弹窗] 1.调用子组件显示添加窗体*/
  const onAdd = () => {
    addRef.value?.show();//调用子组件 显式弹窗方法
  };
  const addRef = ref<typeof MchexpandAdd | null>(null);//模块添加模态弹窗组件引用，用与调用模态弹窗组件内部方法

    /* [显示弹窗] 1.调用子组件显示添加窗体*/
  const onAddWechat = () => {
    addWechatRef.value?.show();//调用子组件 显式弹窗方法
  };
  const addWechatRef = ref<typeof MchexpandAddWeChat | null>(null);//模块添加模态弹窗组件引用，用与调用模态弹窗组件内部方法

      /* [显示弹窗] 1.调用子组件显示添加窗体*/
  const onAddAliplay = () => {
    addAliplayRef.value?.show();//调用子组件 显式弹窗方法
  };
  const addAliplayRef = ref<typeof MchexpandAddAliplay | null>(null);//模块添加模态弹窗组件引用，用与调用模态弹窗组件内部方法

  /* [显示弹窗] 1.接收传入的ID,2.调用子组件显示修改窗体 */
  const onEdit = (id: number) => {
    editRef.value?.show(id);//调用子组件 显示 弹窗方法
  };
  const editRef = ref<typeof MchexpandEdit | null>(null);//模块修改模态弹窗组件引用，用与调用模态弹窗组件内部方法

  /* [显示弹窗] 1.接收传入的ID,2.调用子组件显示窗体 */
  const onShowSingGrcode = (id: number) => {
    showSingGrcodeRef.value?.show(id);//调用子组件 显示 弹窗方法
  };
  const showSingGrcodeRef = ref<typeof MchexpandShowSingGrcode | null>(null);//模块修改模态弹窗组件引用，用与调用模态弹窗组件内部方法

    /* [显示弹窗] 1.接收传入的ID,2.调用子组件显示窗体 */
  const onInquiry = (id: number,old_inquiry_type:number,new_inquiry_type:number) => {
    inquiryRef.value?.show(id,old_inquiry_type,new_inquiry_type);//调用子组件 显示 弹窗方法
  };
  const inquiryRef = ref<typeof MchexpandSetInquiry | null>(null);//模块修改模态弹窗组件引用，用与调用模态弹窗组件内部方法
  
  /* [获取表格数据] 1.调用 table-template 组件的 getTableData 方法 获取数据 2.处理数据 3.赋值 */
  const getTableData = async (searchParams?: Record<string, any>) => { 
    //合并搜索参数和页面参数
    const mergedParams = searchParams ? { ...pageParams, ...searchParams } : pageParams;
    await tableRef.value?.getTableData(pageAction, mergedParams);
  };
  // 重置后重新拉数据
  const handleReset = () => {
    // 重置表格数据到初始状态
    getTableData();
  };
  const tableRef = ref<typeof TableTemplate | null>(null);//table-template组件引用，用于执行组件内部方法
  const pageAction = 'base.merchant.mchexpand.ServiceImpl.page';//page数据 请求接口 方法名
  const pageParams = { account_type: "3" };//page数据 请求参数,查询总后台模块


  onMounted(() => { 
    getTableData(); 
  }); //组件加载完成时，获取表格数据

  /* [按钮配置] */
  const toolbarConfig = [
    {
      text: '新建',
      type: 'primary',
      icon: 'add' as const,
      permission: 'mchexpand_add',
      onClick: onAdd
    },
    // TODO: 到时候会有一个选择账户和支付接口的页面，先实现里面的表单
    {
      text: '添加微信(临时入口)',
      type: 'primary',
      icon: 'add' as const,
      permission: 'mchexpand_add',
      onClick: onAddWechat
    },
    {
      text: '添加支付宝(临时入口)',
      type: 'primary',
      icon: 'add' as const,
      permission: 'mchexpand_add',
      onClick: onAddAliplay
    }
  ];

  /* [搜索配置] */
  const searchConfig = [
    {title: '创建时间（未实现）',dataIndex: 'create_time',type: 'date-range' as const,width: 250}
  ];

  /* [表格配置] */
  const columns: CustomTableColumnType<any>[] = [ 
    {title: '所属OEM',dataIndex: 'oem_name',},
    {title: '所属代理商',dataIndex: 'agent_name',},
    {title: '所属服务商',dataIndex: 'isv_name',},
    {title: '通道名称',dataIndex: 'channel_name',},
    {title: '进件商户类型',dataIndex: 'mch_type',options: {1: '小微商户', 2: '个体工商户',3: '企业'}},
    {title: '进件商户名',dataIndex: 'mch_name',},
    {title: '联系人姓名',dataIndex: 'mch_contact_name',},
    {title: '联系人电话',dataIndex: 'mch_contact_phone',},
    {title: '预审状态',dataIndex: 'inquiry_type',options: {1: '待预审', 2: '预审中',3: '预审通过',4: '预审拒绝'}},
    {title: '渠道审核详情',dataIndex: 'channel_audit_detail'},
    {title: '进件状态',dataIndex: 'expand_type',options: {1: '待审核', 2: '审核中',3: '待验证',4: '待签约',5: '签约完成/审核成功',6: '进件成功',7: '驳回待修改'}},
    {title: '来源类型',dataIndex: 'source_type',options: {1: '运营平台系统', 2: '代理商系统',3: '商户系统'}},
    {title: '备注',dataIndex: 'remark'},
    {title: '操作',dataIndex: 'action',
      buttons: (record) => {
        const baseButton = [
          {
            children: () => '修改',
            type: 'link',
            permission: 'mchexpand_list_edit',
            onClick: (record) => onEdit(record.mch_expand_id),
          },
          {
            children: () => '删除',
            type: 'link',
            permission: 'mchexpand_list_delete',
            onClick: () => {},
          }
        ];
        if(record.inquiry_type === 1){
          baseButton.push({
            children: () => '开始预审',
            type: 'link',
            more: true,
            permission: 'mchexpand_list_inquiry_pass',
            onClick: (record) => onInquiry(record.mch_expand_id,record.inquiry_type,2),
          });
        }
        if(record.inquiry_type === 2){
          baseButton.push({
            children: () => '预审通过',
            type: 'link',
            more: true,
            permission: 'mchexpand_list_inquiry_pass',
            onClick: (record) => onInquiry(record.mch_expand_id,record.inquiry_type,3),
          });
          baseButton.push({
            children: () => '预审拒绝',
            type: 'link',
            more: true,
            permission: 'mchexpand_list_inquiry_reject',
            onClick: (record) => onInquiry(record.mch_expand_id,record.inquiry_type,4),
          });
        }
        if(( record.expand_type === 3 || record.expand_type === 4 ) && record.sign_url){
          baseButton.push({
            children: () => '查看签约链接',
            type: 'link',
            more: true,
            permission: 'mchexpand_list_inquiry_reject',
            onClick: (record) => onShowSingGrcode(record.sign_url),
          });
        }
        
        return baseButton;
      }
    }
  ]
</script>
<style lang="less" scoped>
</style>
